<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org" 
 xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
  <meta charset="utf-8">
  <title>更改</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <link rel="stylesheet" th:href="@{../../static/layui/css/layui.css}"  media="all">
  <script type="text/javascript" th:src="@{../../static/layui/layui.js}"></script>
  <script th:src="@{../../static/js/jquery.min.js}"></script>
  <style>
  .layui-input, .layui-textarea {
    display: block;
    width: 70%;
    padding-left: 10px;
 }
 	.layui-select-title input{
 		width: 100%;
 	}
  </style>
</head>
<body>
		<blockquote class="layui-elem-quote">
		角色关联
		</blockquote>
		<form class="layui-form" action="" lay-filter="menuEdit">
		   <input type="hidden" name="id" id="id">
		 <div class="layui-form-item">
		    <label class="layui-form-label">角色选择</label>
		    <div class="layui-input-block" style="width: 250px">
		      <select name="interest" lay-filter="role" id="roleSelect">
		      	 <option value=""></option>
		         <option th:each="role:${list}" th:value="${role.id}" th:text="${role.roleName}" th:selected=${roleId==role.id}></option>
		      </select>
		      <input type="hidden" name="roleId"  lay-verify="roleId"  id="roleId">
   		 </div>
 		 </div>
 		 <shiro:hasPermission name="sysUser:edit">
		  <div class="layui-form-item">
		    <div class="layui-input-block">
		      <button type="submit" class="layui-btn" lay-submit="" lay-filter="roleSubmit">立即提交</button>
		      <button type="button" class="layui-btn layui-btn-primary" id="cancelButton">取消</button>
		    </div>
		  </div>
		  </shiro:hasPermission>
		</form>
<script th:src="@{../../static/layui/layui.js}"></script>
<script th:inline="javascript">
window.onload = function(){
   var id=[[${id}]];
   var roleId;
   layui.use(['form', 'layedit', 'laydate','jquery'], function(){
 	 var form = layui.form;
 	 var $=layui.jquery;
 	 form.on('select(role)', function(data){  
 		  roleId=data.value;
 		  $("#roleId").val(roleId);
 	  });
 	  form.verify({
		  roleId: function(value){
	      if(value.length <= 0){
	        return '不能为空';
	      }
	    }
	  });
 	 form.on('submit(roleSubmit)', function(data){
 		 $.ajax({
			  url:"/user/sysUser/relationRole.html",
			  type:"POST",
			  async:false,
			  dataType:"json",
		  	  data:{id:id,roleId:roleId},
		  	  success:function(result){
		  		  if(result.code==200){
		  			alert("关联成功");
		  			//layer.msg(result.message, {icon: result.icon});
		  		  }else{
		  			layer.msg("关联失败", {icon: 2}); 
		  		  }
		  		  closeIframe();//关闭弹框
		  		  window.parent.location.reload();//刷新父页面
		  	   }
		});
 	 })
 	function closeIframe(){
		  var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
		  parent.layer.close(index)
	 }
   });
}
</script>
</body>
</html>